<html>
    <head>
        {foreach item=sd from=$seldest}
            {assign var='id' value=$sd.id}
            {assign var='curselection' value=$sd.country}
            {assign var='color1' value=$sd.color1}
            {assign var='color2' value=$sd.color2}
        {/foreach}

        {foreach item=p from=$package}
            {assign var='pck' value=$p}
            {assign var='fb_id' value=$p.id}
            {assign var='fb_name' value='PACKAGE DETAIL → '|cat:$p.title}
            {assign var='fb_desc' value=$p.short_title}
        {/foreach}

        {foreach item=c from=$cities}
            {append var='city_ids' value=$c.id}
            {append var='city_names' value=$c.city}
        {/foreach}

        {assign var=allcities value=$allcities}

        {assign var=cities2 value=$allcities}
        {assign var=citycou value=0}
        {foreach item=c2 from=$cities2 name=i}
            {if  $smarty.foreach.i.iteration==1} 
                {assign var=firstcity value=$c2.id}
            {/if}

            {if $c2.id==$catid}
                {assign var=currcatid value=$citycou}
            {/if}

            {$citycou = $citycou + 1}
        {/foreach}

        {foreach item=e from=$embassy}
            {assign var=emb value=$e}
        {/foreach}


        {foreach item=prt from=$partners}
            {append var='partner_ids' value=$prt.id}
            {append var='partner_names' value=$prt.partnername}
        {/foreach}

        {assign var='cou' value=1}

        {*if $pck.cat_id=='1'}
        {assign var='catname' value='Individual Package'}
        {else if $pck.cat_id=='2'}
        {assign var='catname' value='Group Package'}
        {else}
        {assign var='catname' value='Landing Only'}
        {/if*}


        {foreach item=pct from=$packcat}
            {if $pck.cat_id == $pct.id}
                {assign var='catname' value=$pct.package}
            {/if}
        {/foreach}

        <title>{$title|default:"no title"}</title>

        {literal}
            <link href="css/fontstyle.css" rel="stylesheet" type="text/css" charset="utf-8" />
            <link href="css/style.css" rel="stylesheet" type="text/css" />
            <link href="css/jquery-ui.css" type="text/css" rel="stylesheet"  />
            <link href="css/jquery.lightbox-0.5.css" type="text/css" rel="stylesheet" media="screen" />
            <link href="css/packagedetailscss.css" type="text/css" rel="stylesheet"  />

            <script type="text/javascript" src='js/jquery-1.7.2.min.js'></script>
            <script type="text/javascript" src="js/jquery-ui.js"></script>

            <script type="text/javascript" src="js/jquery.corner.js"></script>
            <script type="text/javascript" src="js/gettheme.js"></script>
            <script type="text/javascript" src="js/jquery.printPage.js"></script>
            <script type="text/javascript" src="js/jquery.lightbox-0.5.pack.js"></script>

            <script src="js/jquery.ui.widget.js"></script>
            <script src="js/jquery.ui.accordion.js"></script>

            <script>
                $(function() {
                    $( "#accordion" ).accordion({
                        active: false, 
                        navigation: false, 
                        animated: 'easeslide' 
                    }
                    );
                });
            </script>

            <script type="text/javascript">
                var _gaq = _gaq || [];
                _gaq.push(['_setAccount', 'UA-33771657-1']);
                _gaq.push(['_trackPageview']);

                (function() {
                    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
                })();
            </script>

            <script type="text/javascript">
                    $(function()
                    {
                        $('#gallery a').lightBox({
                            imageLoading: 'images/loading.gif'
                        });
                    });
                        
                    $(document).ready(function(){
                        $("#tabs").tabs({ fx: { opacity: 'toggle' }});
                        $("#printicon").printPage();
                    });
                    function savePage(attachment){
                        if (attachment == 'backend/')
                            attachment = '';
                            
                        if (attachment != '') {
                            window.open(attachment, 'Save pdf', 'width=1,height=1');
                        } else {
                            alert('There is no attachment for this package yet');
                        }
                    }
                        
                    function submitform() {
                        var txtname = $('#txtname').val();
                        var txtmail = $('#txtmail').val();
                        var txtdomisili = $('#txtdomisili').val();
                        var txtsubject = $('#txtsubject').val();
                        var txtmessage = $('#txtmsg').val();
                        var partneridpost = $('#partneridpost').val();

                        $.post("contact_proc.php",
                        { ajax: 'yes', partneridpost: partneridpost, txtname: txtname, txtmail: txtmail, txtdomisili: txtdomisili, txtsubject: txtsubject, txtmsg: txtmessage },
                        function(returned) {
                            alert(returned);
                            clearForm();
                        });
                    }
                        
                    function clearForm() {
                        $('#txtname').val('');
                        $('#txtmail').val('');
                        $('#txtdomisili').val('');
                        $('#txtsubject').val('');
                        $('#txtmsg').val('');
                        $('#partneridpost').val('');
                    }
                                           
                    function sharePage(id, name, caption, description) {
                        window.open("http://www.facebook.com/dialog/feed?app_id=354919894599261&link=http://demo.ats-vacations.com/packagedetail.php?id="+id+"&picture=http://demo.ats-vacations.com/images/ats_logo.png&name="+name+"&description="+description+"&redirect_uri=http://demo.ats-vacations.com", '', 'width=900,height=600');
                    }
                        
                    function showpackagelist(id, cityid) {
                        var newlink = "packagecategory.php?id="+id+"&c="+cityid+"&p=2";
                        document.location = newlink;
                    }
            </script>

            <style type="text/css">
                .ui-icon {
                    display: none;
                }
                .ui-tabs .ui-tabs-nav li {
                    margin: 0px;
                    color: #{/literal}{$color1}{literal};
                }

                .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {
                    color: #{/literal}{$color1}{literal};
                    font-size: 16px;
                }

                .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
                    font-size: 16px;
                }

                .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
                    /*                    background-image: url('images/package_menu_active_back.png');*/
                    background-repeat: repeat-x;
                    background-position: top center;
                    display: inline-block;
                    text-decoration: none;
                }

                .packagetitleheader {
                    font-family:'Myriad Pro';
                    text-align:left;
                    font-size: 24px;
                    overflow: hidden;
                    color: #47494b;
                    padding: 10px;
                    margin-left: 5px;
                }
                #leftframecontent {
                    background: none;
                }
                a {
                    text-decoration: none;
                    font-family: 'Myriad Pro';
                    outline: 0px none;
                    font-size: 16px;
                }
                li {
                    text-decoration: none;
                    font-family: 'Myriad Pro';
                    outline: 0px none;
                    font-size: 16px;
                }
                ul {
                    list-style: none;
                }


                .packageframe {
                    float: left; position: absolute; z-index: 2
                }
                .packageimg {
                    position: absolute; 
                    z-index: 1; 
                    width: 140px; 
                    height: 115px;
                    margin-left: 20px; 
                    margin-top: 20px;
                }

            </style>
        {/literal}
    </head>
    <body id="packages" onload="initpage();">
        <div id="fb-root"></div>
        <script>(function(d, s, id) {
          var js, fjs = d.getElementsByTagName(s)[0];
          if (d.getElementById(id)) return;
          js = d.createElement(s); js.id = id;
          js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
          fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));</script>


        {include file='header.tpl'}

        {include file='sidebar.tpl'}

        <div id="container_breadcrumb">
            Home > Our Packages > {$curselection} > {$catname} > {$pck.title}
        </div>

        <div id="container_package">
            <input type="hidden" id="selectedpackage" />
            <input type="hidden" id="selectedsort" />

            <table border="0"
                   width="100%"
                   cellspacing="0"
                   cellpadding="0">
                <tr valign="top">
                    <td width="25%" valign="top">
                        <div id="leftframetitle">
                            <span class="red_color">OUR</span><span class="black_color">PACKAGES</span>
                        </div>

                        {*foreach item=d from=$dest}
                        <div id="leftframecontent">
                        <img class="packagebutton" src="{$d.button_img}" />
    
                        <a href="packagecategory.php?id={$d.id}&s=">
                        <div class="packagelink">
                        {$d.country|upper}
                        </div>
                        </a>
    
                        </div>
                        {/foreach*}


                        <div id="accordion">                            
                            {foreach item=d from=$dest}
                                {assign var=did value=$d.id}
                                <p id="leftframecontent" class="packagelink">
                                    <img class="packagebutton" src="{$d.button_img}" />
                                    <a href="#" class="packagelink" id="cat{$d.id}" style="padding-top: 0;"
                                       onmouseover="changeImages('worldmap_01', '{$d.image}'); return true;"
                                       onmouseout ="changeImages('worldmap_01', 'images/worldmap_01.gif'); return true;"
                                       onmousedown="changeImages('worldmap_01', '{$d.image}'); return true;"
                                       onmouseup  ="changeImages('worldmap_01', '{$d.image}'); return true;"
                                       onclick="showpackagelist('{$did}','{$firstcity}'); return false;"
                                       >{$d.country|upper}</a>
                                </p>
                                <div style="padding: 0; margin-top: 0; margin-bottom: 0; overflow: none;">
                                    <ul style="list-style: none; padding-left: 90px; margin-top: -1px;">
                                        {foreach item=ac from=$allcities}
                                            <li><a href="packagecategory.php?id={$d.id}&c={$ac.id}">From {$ac.city}</a></li>
                                        {/foreach}                                        

                                    </ul>
                                </div>
                            {/foreach}
                        </div>
                    </td>

                    <td>
                        <div id="rightframecontent" style="width: 100%;">

                            <!-- <div id="leftmenucorner" class="leftrounded" data-corner="left 12px"></div> -->

                            <div class="packagetitleheader">{$pck.title}</div>
                            <!--                            <div id="spacer"></div>-->

                            <!--                            <div id="gallery">
                                                            <ul>-->
                            {assign var='margintop' value=0}
                            {assign var='leftpos' value=0}
                            {foreach item=pic from=$images}
                                <!--                                        <li>-->
                                <div style="display: inline-block; position: relative; left: {$leftpos}px">
                                    <a href="backend/{$pic.filename}">
                                        <img class="packageframe"
                                             src="images/package_frame.png" />
                                        <img src="backend/{$pic.filename}"
                                             class="packageimg" />
                                    </a>
                                </div>
                                {$leftpos=$leftpos+165}
                                {$margintop=125}
                                <!--                                        </li>-->
                            {/foreach}
                            <!--                                </ul>
                                                        </div>-->
                            <div id="spacer"></div>

                            <div id='tabs' style="margin-top: {$margintop}px;">
                                <ul>
                                    <li class="leftsiderounded">
                                        <a href="#taboverview">OVERVIEW</a>
                                    </li>
                                    <li class="tab_separator"></li>
                                    <li><a href="#tabitinerary">ITINERARY</a></li>
                                    <li class="tab_separator"></li>
                                    <li><a href="#tabdates">DATES & PRICES</a></li>
                                    <li class="tab_separator"></li>
                                    <li><a href="#tabtravel">TRAVEL DOCUMENT</a></li>
                                    <li class="tab_separator"></li>
                                    <li class="rightsiderounded">
                                        <a href="#tabquestion">ASK QUESTION</a>
                                    </li>
                                    <li style="width: 10px;">&nbsp;</li>
                                    <li class="saveprintbutton">
                                        {assign var='pdffile' value=$pck.pdf_attachment}
                                        {if !($pdffile|file_exists)}
                                            {$pdffile = ''}
                                        {/if}
                                        <img class="saveprintroundedbox" 
                                             src="images/save_icon.png"
                                             onclick="savePage('{$pdffile}');" />

                                        <div class="tab_separator"></div>

<!--                                        <img id="printicon" class="saveprintroundedbox" src="images/print_icon.png" />

<div class="tab_separator"></div>-->

                                        <img class="saveprintroundedbox" 
                                             src="images/fb_icon.png"
                                             onclick="sharePage('{$fb_id}','{$fb_name}','x','{$fb_desc}');" />
                                    </li>
                                    {*<li>
                                        
                                    <script size="small" src="http://widgets.fbshare.me/files/fbshare.js"></script>
                                    <!--http://www.fbshare.me/-->
                                    <!--<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a>
                                    <script src="http://static.ak.fbcdn.net/connect.php/js/FB.share" type="text/javascript"></script>-->

                                    <!--                                        
                                    <div class="fb-like" 
                                    data-href="http://demo.ats-vacation.com" 
                                    data-send="true" data-width="450" data-show-faces="true"></div>
                                    -->
                                    
                                    </li>*}
                                </ul>

                                <div id='taboverview' class="tabcontent">
                                    <div class="pack_ov_title">{$pck.ov_title}</div>

                                    <div class="pack_ov_title">PERIOD</div>
                                    <div class="pack_ov_text">{$pck.ov_period}</div>

                                    <div class="pack_ov_title">BONUS</div>
                                    <div class="pack_ov_text">{$pck.ov_bonus}</div>

                                    <div class="pack_ov_title">HIGHLIGHT</div>
                                    <div class="pack_ov_text">{$pck.ov_highlight|html_entity_decode|wordwrap:60}</div>

                                    <div class="pack_ov_title">HAL-HAL PERHATIAN</div>
                                    <div class="pack_ov_text">{$pck.ov_notice|html_entity_decode}</div>
                                </div>
                                <div id='tabitinerary' class="tabcontent">
                                    <table border="0" width="100%" cellpadding="4" cellspacing="4">
                                        {foreach item=iten from=$itinerary}
                                            <tr valign="middle" >
                                                <td width="13%" align="center">
                                                    <div class="pack_iten_calendar">{$cou}</div>
                                                </td>
                                                <td class="pack_ov_text">{$iten.detail|html_entity_decode}</td>
                                            </tr>

                                            {$cou = $cou + 1}
                                        {/foreach}
                                    </table>

                                </div>
                                <div id='tabdates' class="tabcontent">
                                    <div class="pack_ov_title">DATES & PRICES</div>
                                    <div class="pack_ov_text">{$pck.da_depdate}</div>
                                    <div id="spacer"></div>

                                    <div class="pack_ov_title">{$pck.da_pricelabel|upper}</div>
                                    {*foreach item=price from=$prices*}
                                    <div class="pack_ov_text">{$pck.da_pricetable|html_entity_decode}</div>
                                    {*/foreach*}
                                    <div class="pack_ov_title">BIAYA TAMBAHAN</div>
                                    <div class="pack_ov_text">{$pck.da_extraprice|html_entity_decode}</div>
                                </div>
                                <div id='tabtravel' class="tabcontent">
                                    <div class="pack_ov_title">EMBASSY LOCATION</div>
                                    <div class="pack_ov_text">
                                        <table border="0" width="80%" cellspacing="1" cellpadding="1">
                                            <tr class="pack_ov_text">
                                                <td width="10%">Address</td>
                                                <td>
                                                    {if isset($emb.address)}
                                                        {$emb.address}
                                                    {/if}
                                                </td>
                                            </tr>
                                            <tr class="pack_ov_text">
                                                <td>Phone</td>
                                                <td>
                                                    {if isset($emb.phone)}
                                                        {$emb.phone}
                                                    {/if}
                                                </td>
                                            </tr>
                                            <tr class="pack_ov_text">
                                                <td>Fax</td>
                                                <td>
                                                    {if isset($emb.fax)}
                                                        {$emb.fax}
                                                    {/if}
                                                </td>
                                            </tr>
                                        </table>
                                    </div>

                                    <div class="pack_ov_title">VISA PRICES & PROCEDURES</div>
                                    <div class="pack_ov_text">
                                        {if isset($emb.visaprices)}
                                            {$emb.visaprices|html_entity_decode}
                                        {/if}
                                    </div>

                                    <div class="pack_ov_title">PROCESSING REQUIREMENTS</div>
                                    <div class="pack_ov_text">
                                        {if isset($emb.visaprices)}
                                            {$emb.visaprices|html_entity_decode}
                                        {/if}
                                    </div>

                                    <div class="pack_ov_title">NOTES</div>
                                    <div class="pack_ov_text">
                                        {if isset($emb.notes)}
                                            {$emb.notes|html_entity_decode}
                                        {/if}
                                    </div>
                                </div>
                                <div id='tabquestion' class="tabcontent">
                                    <div class="pack_ov_title">SORRY, WE ONLY ACCEPT BOOKING FROM OUR TRAVEL AGENCY</div>
                                    <div class="pack_ov_text">Interesting with this travel package? Let us help you to contact our partner Travel Agency</div>

                                    <form id="fm_question" method="post" action="contact_proc.php">
                                        <div id="contactus_content_14">
                                            <table border="0" width="70%" cellspacing="1" cellpadding="1" id="contactus_content_14">
                                                <tr>                                    
                                                    <td width="40%">
                                                        <div class="textbox_long">
                                                            <div class="lbinput_long"><label>Your Name</label></div>
                                                            <input class="easyui-validatebox" 
                                                                   type="text" 
                                                                   name="txtname" 
                                                                   id="txtname" 
                                                                   size="45" 
                                                                   required="true"
                                                                   style="margin-left: 190px; margin-top: 5px; border: 0; background-color: transparent; height: 25px;" />
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr>
                                                    <td width="40%">
                                                        <div class="textbox_long">
                                                            <div class="lbinput_long"><label>Your Email</label></div>
                                                            <input class="easyui-validatebox" 
                                                                   type="text" 
                                                                   name="txtmail" 
                                                                   id="txtmail" 
                                                                   size="45" 
                                                                   required="true"
                                                                   validType="email"
                                                                   style="margin-left: 190px; margin-top: 5px; border: 0; background-color: transparent; height: 25px;" />
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr>
                                                    <td width="40%">
                                                        <div class="textbox_long">
                                                            <div class="lbinput_long"><label>Domisili</label></div>
                                                            <input class="easyui-validatebox" 
                                                                   type="text" 
                                                                   name="txtmail" 
                                                                   id="txtmail" 
                                                                   size="45" 
                                                                   required="true"
                                                                   validType="email"
                                                                   style="margin-left: 190px; margin-top: 5px; border: 0; background-color: transparent; height: 25px;" />

                                                            {* html_options name='txtdomisili' 
                                                            id='txtdomisili' 
                                                            values=$city_ids 
                                                            output=$city_names 
                                                            style="margin-left: 190px; margin-top: 5px; border: 1px solid black; background-color: transparent; height: 25px;width: 320px;" *}
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr>
                                                    <td width="40%">
                                                        <div class="textbox_long">
                                                            <div class="lbinput_long"><label>Choose Travel Agency</label></div>
                                                            {html_options name='partneridpost' 
                                                                          id='partneridpost' 
                                                                          values=$partner_ids 
                                                                          output=$partner_names 
                                                                          style="margin-left: 190px; margin-top: 5px; border: 1px solid black; background-color: transparent; height: 25px;width: 320px;"}
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr>
                                                    <td width="40%">
                                                        <div class="textbox_long">
                                                            <div class="lbinput_long"><label>Subject</label></div>
                                                            <input class="easyui-validatebox" 
                                                                   type="text" 
                                                                   name="txtsubject" 
                                                                   id="txtsubject" 
                                                                   size="45"
                                                                   style="margin-left: 190px; margin-top: 5px; border: 0; background-color: transparent; height: 25px;" />
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr>
                                                    <td width="40%">
                                                        <div class="textarea_long">
                                                            <div class="lbinput_long"><label>Message</label></div>
                                                            <textarea name="txtmsg" 
                                                                      id="txtmsg"
                                                                      cols="43"
                                                                      rows="9"
                                                                      style="margin-left: 190px; margin-top: 5px; border: 0;background-color: transparent; "></textarea>
                                                        </div>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td width="40%" align="right">                                        
                                                        <img class="submitlink" src="images/submit_btn.png"
                                                             onclick="submitform();"/>                                        
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>

                                    </form>


                                </div>
                            </div>


                        </div>


                    </td>
                </tr>
            </table>

            <div id="footer-spacer"></div>
        </div>

        {include file='footer.tpl'}

    </body>
</html>